<template>
	<div class="alert-wrapper">
		<alert-box v-for="(item) in alertStore.alerts" :key="item.id" class="alert"
		:type="item.type"
		:title="item.title"
		:show="item.show"
		>{{ console.log(alertStore.alerts.length) }}</alert-box>
	</div>
</template>

<script setup>
import { useAlertStore } from '@/stores/alert-store';
import alertBox from './alert-box.vue';

const alertStore = useAlertStore()
// console.log(alertStore.alerts)
</script>

<style scoped>
.alert-wrapper {
	position: fixed;
	top: 20px;
	left: 30%;
	width: 40%;
	z-index: 1000;
}
</style>